import React, {Component} from 'react';
import {Button, Alert, Icon} from 'antd';
import {connect} from 'react-redux';
import {CommonTable} from 'components';
import styles from './BusinessLastCheck.less';
import {covertUrlParams, orderStatus} from 'utils';
import { CheckOption } from '../BusinessRepeatCheck/index';
import { businessLastCheckAction } from './index';
import { bindActionCreators } from "redux";
import moment from 'moment';

class BusinessLastCheck extends Component {

    params = ['baseInfo', 'operatorInfo', 'checkResult']

    constructor(props) {
        super(props);
        this.state = {
            isShowDetail: this.getParamsOption(this.props)

        };
        const _this = this;
        this.pageSize = 10;
        this.orderId = '';
        this.columns = [
            {title: '订单号', dataIndex: 'orderNo', key: 'orderNo'},
            // {title: '产品类型', dataIndex: 'deviceModel', key: 'deviceModel'},
            {title: '姓名', dataIndex: 'userTrueName', key: 'userTrueName'},
            {title: '手机号', dataIndex: 'userPhone', key: 'userPhone'},
            {
                title: '是否是老用户',
                dataIndex: 'isOlduser',
                key: 'isOlduser',
                render(text){
                    return Number(text) === 0 ? '否' : '是';
                }
            },
            {title: '正常还款金额(元)', dataIndex: 'deviceMoney', key: 'deviceMoney'},
            {title: "申请金额(元)", dataIndex: "lendMoney", key: "lendMoney"},
            {title: "借款期限(天)", dataIndex: "lendDays", key: "lendDays"},
            {
                title: "手续费(元)",
                dataIndex: "serviceMoney",
                key: "serviceMoney",
                // render(text, record) {
                //     const {deviceMoney = 0} = record;
                //     const res = Number(deviceMoney) * 0.2;
                //     return Number.isInteger(res) ? res : res.toFixed(2);
                // }
                render(text, record) {
                    const {deviceMoney, lendMoney } = record;
                    const res = (Number(deviceMoney)*10) - (Number(lendMoney)*10);
                    const resNum = res/10
                    // return Number.isInteger(res) ? res : res.toFixed(2);
                    return resNum;
                }
            },
            {
                title: '申请时间',
                dataIndex: 'applyTime',
                key: 'applyTime',
                render(text) {
                    return moment(Number(text)*1000).format('YYYY-MM-DD HH:mm:ss');
                }
            },
            {title: '渠道来源', dataIndex: 'channelId', key: 'channelId'},
            // {title: '审核员', dataIndex: 'examiner2Id', key: 'examiner2Id'},
            {
                title: '状态',
                dataIndex: 'status',
                key: 'status',
                render(text) {
                    return orderStatus[text];
                }
            },
            {
                title: '操作',
                dataIndex: 'id',
                key: 'id',
                render(text, record) {
                    return (
                        <div onClick={() => _this.handleClick(record)} className={styles.check}><Icon type={'edit'}/>
                        </div>
                    );
                }

            }

        ]
    }

    getParamsOption = (props) => {
        const {location: {search}} = props;
        const obj = covertUrlParams(search);
        const arr = Object.keys(obj);
        return arr.indexOf('option') !== -1 && this.params.indexOf(obj['option']) !== -1;

    }

    //获取订单详情，跳转审核页面
    handleClick = (record) => {
        const { setOrderId, getDetailData } = this.props;
        const {id, userId} = record;
        //保存id
        setOrderId(id);
        getDetailData({orderId: id, userId});
    }
    getOrder = () => {
        const { distributeRepeatOrder } = this.props;
        distributeRepeatOrder({});
    }

    handlePageChange = (info) => {
        const { current, pageSize } = info;
        const {getTableData} = this.props;
        getTableData({ pageNum: current, pageSize })

    }
    //审核
    handleCheck = (obj) => {
        const { checkOption, reason } = obj;
        const { postCheck, orderId } = this.props;
        postCheck({ orderId, status: checkOption, reason });

    }


    componentDidMount() {
        const {getTableData} = this.props;
        getTableData({ pageNum: 1, pageSize: this.pageSize });
    }
    componentWillUnmount() {
        const { setTableData } =  this.props;
        setTableData({ data: [], pagination: {} });
    }
    componentWillReceiveProps(nextProps) {
        const next = this.getParamsOption(nextProps);
        const current = this.getParamsOption(this.props);
        if(next !== current) {
            this.setState({ isShowDetail: next });
        }
    }

    componentDidUpdate(prevProps, prevState) {
        const { isShowDetail } = prevState;
        if(isShowDetail && isShowDetail !==  this.state.isShowDetail) {
            const {getTableData} = this.props;
            getTableData({pageNum: 1, pageSize: this.pageSize});
        }
    }
    render() {
        const { tableData: { data, pagination }, loading, btnLoading, allData, surplusOrder } = this.props;
        const { isShowDetail } = this.state;
        return (
            <div>
                {
                    isShowDetail ? <div>

                            <CheckOption
                                loading={btnLoading}
                                allData={allData}
                                isLastCheck={true}
                                handleSubmit={this.handleCheck}
                            />
                        </div> :
                        <div>
                            <div>
                                <div className={styles.btn}>
                                    <Button onClick={this.getOrder} type={'primary'}>获取订单</Button>
                                </div>
                                <Alert message={`可审核订单数：${surplusOrder}`} type="info"/>
                            </div>

                            <CommonTable
                                handlePageChange={this.handlePageChange}
                                columns={this.columns}
                                pagination={pagination}
                                loading={loading}
                                dataSource={data}
                            />
                        </div>
                }

            </div>
        );
    }

}

const mapStateToProps = (state) => {
    const {windControlCheckState: { businessLastCheckState }} = state;
    return {
        tableData: businessLastCheckState['data'],
        loading: businessLastCheckState['loading'],
        btnLoading: businessLastCheckState['submitLoading'],
        allData: businessLastCheckState['allData'],
        orderId: businessLastCheckState['orderId'],
        surplusOrder: businessLastCheckState['surplusOrder']
    }
};
const mapDispatchToProps = (dispatch) => {
    return bindActionCreators({
        getTableData: businessLastCheckAction.blcGetTableData,
        setTableData: businessLastCheckAction.blcSetTableData,
        getDetailData: businessLastCheckAction.blcGetDetailData,
        postCheck: businessLastCheckAction. blcPostCheckInfo,
        setOrderId: businessLastCheckAction.blcSetOrderId,
        distributeRepeatOrder: businessLastCheckAction.blcDistributeOrder
    }, dispatch)
}

export default connect(mapStateToProps, mapDispatchToProps)(BusinessLastCheck);

